<%@taglib uri="/WEB-INF/struts-logic.tld" prefix="logic" %>
<%@taglib uri="/WEB-INF/struts-bean.tld" prefix="bean"%>
<%@taglib uri="http://java.sun.com/jstl/core_rt" prefix="c" %>
<div>
    <logic:present name="acc">
        <logic:equal name="roleUser" value="admin">
            <p align="right"><a href="AdminUser.do?action=listRole" >role manager</a></p>
            <logic:present name="listAccount">
                <logic:notEmpty name="listAccount">
                    <form name="fr">
                        <table width="100%" border="1">
                            <tr>
                                <td>user name</td>
                                <td>role name</td>
                                <td>full name</td>
                                <td>mail</td>
                                <td>phone</td>
                                <td>address</td>
                                <td>Action</td>
                            </tr>
                            <logic:iterate name="listAccount" id="listAccount" >
                                <tr>
                                    <td>
                                        <input type="text" size="10" readonly name="fruse<bean:write name="listAccount" property="userName"/>"
                                               id="fruse<bean:write name="listAccount" property="userName"/>"
                                               value="<bean:write name="listAccount" property="userName"/>">
                                    </td>
                                    <td>
                                        <input type="text" size="10" readonly name="frrole<bean:write name="listAccount" property="userName"/>"
                                               id="frrole<bean:write name="listAccount" property="userName"/>"
                                               value="<bean:write name="listAccount" property="roleDTO.roleName"/>">
                                        <input type="hidden" name="frroleId<bean:write name="listAccount" property="userName"/>"
                                               id="frroleId<bean:write name="listAccount" property="userName"/>"
                                               value="<bean:write name="listAccount" property="roleDTO.roleId"/>">
                                    </td>
                                    <td>
                                        <input type="text" size="10" readonly name="frname<bean:write name="listAccount" property="userName"/>"
                                               id="frname<bean:write name="listAccount" property="userName"/>"
                                               value="<bean:write name="listAccount" property="fullName"/>">
                                    </td>
                                    <td>
                                        <input type="text" size="20" readonly name="frmail<bean:write name="listAccount" property="userName"/>"
                                               id="frmail<bean:write name="listAccount" property="userName"/>"
                                               value="<bean:write name="listAccount" property="email"/>">
                                    </td>
                                    <td>
                                        <input type="text" size="10" readonly name="frphone<bean:write name="listAccount" property="userName"/>"
                                               id="frphone<bean:write name="listAccount" property="userName"/>"
                                               value="<bean:write name="listAccount" property="phoneNumber"/>">
                                    </td>
                                    <td>
                                        <input type="text" size="20" readonly name="fradd<bean:write name="listAccount" property="userName"/>"
                                               id="fradd<bean:write name="listAccount" property="userName"/>"
                                               value="<bean:write name="listAccount" property="address"/>">
                                    </td>
                                    <td>
                                        <img title="Add" src="admin/img/action_add.png" onclick="showAdd();" style="cursor:pointer">
                                        <img title="Edit" src="admin/img/action_remove.png" onclick="showUpdate('<bean:write name="listAccount" property="userName"/>');" style="cursor:pointer">
                                        <img title="Delete" src="admin/img/action_delete.png" name="action" style="cursor:pointer" onclick="showDelete('<bean:write name="listAccount" property="userName"/>');"/>
                                    </td>
                                </logic:iterate>
                        </table>
                    </form>
                    <br/><br/><br/>
                    <form name="fr1" style="visibility:hidden" action="AdminUser.do" method="get">
                        <table width="600" align="left">
                            <tr>
                                <td>
                                    <table class="tablemain" border="0">
                                        <tr >
                                            <th height="32" colspan="3" scope="col">Manager User </th>
                                        </tr>
                                        <tr>
                                            <td width="253" height="32"><div align="right">UserName :</div> </td>
                                            <td width="510" colspan="2">
                                                <input type="text" name="fr1use"  id="fr1use"/>
                                                <input type="hidden" name="fr1useedit"  id="fr1useedit"/>
                                            </td>
                                        </tr>
                                        <tr>
                                            <td height="39"><div align="right">pass : </div></td>
                                            <td colspan="2">
                                                <input type="text" name="fr1pass" id="fr1pass" />
                                            </td>
                                        </tr>
                                        <tr>
                                            <td height="100"><div align="right">Role : </div></td>
                                            <td >
                                                <logic:present name="listRole">
                                                    <div style="height:100; width:200;overflow:auto">
                                                        <logic:iterate name="listRole" id="listRole">
                                                            <input type="radio" name="role" value="<bean:write name="listRole" property="roleId"/>"> <bean:write name="listRole" property="roleName"/><br/>
                                                        </logic:iterate>
                                                    </div>

                                                </logic:present>
                                            </td>
                                            <td><a href="AdminUser.do?action=listRole" >role manager</a></td>
                                        </tr>
                                        <tr>
                                            <td height="39"><div align="right">full name : </div></td>
                                            <td colspan="2">
                                                <input type="text" name="fr1name" id="fr1name"/>
                                            </td>
                                        </tr>
                                        <tr>
                                            <td height="39"><div align="right">mail : </div></td>
                                            <td colspan="2">
                                                <input   type="text" name="fr1mail" id="fr1mail"/>
                                            </td>
                                        </tr>
                                        <tr>
                                            <td height="39"><div align="right">phone : </div></td>
                                            <td colspan="2">
                                                <input type="text" name="fr1phone" id="fr1phone" />
                                            </td>
                                        </tr>
                                        <tr>
                                            <td height="39"><div align="right">arrdess: </div></td>
                                            <td colspan="2">
                                                <input type="text" name="fr1add" id="fr1add" />
                                            </td>
                                        </tr>
                                        <tr>
                                            <td height="39" colspan="3"><div align="center">
                                                    <input type="submit" name="action" id="insert" value="Insert" onclick="return validatorForm();"/>
                                                    <input type="submit" name="action" id="update" value="Update" onclick="return validatorForm();"/>
                                                    <input type="submit" name="action" id="delete" value="Delete" onclick="return confirmForm();"/>
                                                </div>
                                            </td>
                                        </tr>
                                    </table>
                                </td>
                            </tr>
                        </table>
                    </form>

                </logic:notEmpty>
                <logic:empty name="listAccount">
                    ban chi dc xem thong tin ma thoi
                </logic:empty>
            </logic:present>
        </logic:equal>
        <logic:notPresent name="listAccount">
            ban chi dc xem thong tin ma thoi
        </logic:notPresent>
    </logic:present>
    <logic:notPresent name="acc">
        <jsp:forward page="adminHome.jsp"/>
    </logic:notPresent>
</div>
<script>
    function showAdd(){

        document.getElementById('fr1use').value ="";
        document.getElementById('fr1pass').value ="";
        document.getElementById('fr1name').value ="";
        document.getElementById('fr1mail').value ="";
        document.getElementById('fr1phone').value ="";
        document.getElementById('fr1add').value ="";
        document.getElementById('fr1use').disabled= false;
        document.fr1.style.visibility='visible';
        for(i = 0;i < document.fr1.role.length;i++){

            document.fr1.role[i].checked = false;


        }
        document.fr1.role[0].checked = true;
        document.getElementById('update').style.visibility='hidden';
        document.getElementById('delete').style.visibility='hidden';
        document.getElementById('insert').style.visibility='visible';

    }

    function showUpdate(element){
        for(i = 0;i < document.fr1.role.length;i++){
            if(document.fr1.role[i].value == document.getElementById('frroleId'+element).value){
                document.fr1.role[i].checked = true;
            }

        }
        document.fr1.style.visibility='visible';
        document.getElementById('insert').style.visibility='hidden';
        document.getElementById('update').style.visibility='visible';
        document.getElementById('delete').style.visibility='hidden';
        document.getElementById('fr1use').disabled= true;
        document.getElementById('fr1useedit').value = document.getElementById('fruse'+element).value;
        document.getElementById('fr1use').value = document.getElementById('fruse'+element).value;
        document.getElementById('fr1name').value = document.getElementById('frname'+element).value;
        document.getElementById('fr1mail').value = document.getElementById('frmail'+element).value;
        document.getElementById('fr1phone').value = document.getElementById('frphone'+element).value;
        document.getElementById('fr1add').value = document.getElementById('fradd'+element).value;
    }

    function showDelete(element){
        for(i = 0;i < document.fr1.role.length;i++){
            if(document.fr1.role[i].value == document.getElementById('frroleId'+element).value){
                document.fr1.role[i].checked = true;
            }

        }
        document.fr1.style.visibility='visible';
        document.getElementById('insert').style.visibility='hidden';
        document.getElementById('delete').style.visibility='visible';
        document.getElementById('update').style.visibility='hidden';
        document.getElementById('fr1use').disabled= true;
        document.getElementById('fr1useedit').value = document.getElementById('fruse'+element).value;
        document.getElementById('fr1use').value = document.getElementById('fruse'+element).value;
        document.getElementById('fr1name').value = document.getElementById('frname'+element).value;
        document.getElementById('fr1mail').value = document.getElementById('frmail'+element).value;
        document.getElementById('fr1phone').value = document.getElementById('frphone'+element).value;
        document.getElementById('fr1add').value = document.getElementById('fradd'+element).value;
    }

    function emailValidator(elem, helperMsg){
        var emailExp = /^[\w\-\.\+]+\@[a-zA-Z0-9\.\-]+\.[a-zA-z0-9]{2,4}$/;
        if(elem.value.match(emailExp)){
            return true;
        }else{
            alert(helperMsg);
            elem.focus();
            return false;
        }
    }
    function notEmpty(elem, helperMsg){
        if(elem.value.length == 0){
            alert(helperMsg);
            elem.focus(); // set the focus to this input
            return false;
        }
        return true;
    }
    function validatorForm(){
        var use = document.getElementById('fr1use');
        var name = document.getElementById('fr1name');
        var email = document.getElementById('fr1mail');
        var phone = document.getElementById('fr1phone');
        var pass = document.getElementById('fr1pass');
        var add = document.getElementById('fr1add');

        // Check each input in the order that it appears in the form!
        if(notEmpty(use, "Please enter usename")){
            if(notEmpty(pass, "Please enter password")){
                if(notEmpty(name, "Please enter full name")){
                    if(notEmpty(email, "Please enter fmail;")){
                        if(emailValidator(email, "Please check mail")){
                            if(notEmpty(phone,"Please enter phone")){
                                if(notEmpty(add, "Please enter address")){

                                    return true;

                                }
                            }
                        }
                    }
                }
            }
        }
        return false;
    }
    function confirmForm(){
        var answer = confirm("are you want delete")
        if (answer){

            return true;
        }
        else{
            return false;
        }
    }
</script>